<template>
	<div class="AdminBackstage">
		<Table border :columns="columns1" :data="shop">
			<template slot-scope="{ row }" slot="name">
				<strong>{{ row.name }}</strong>
			</template>
			<template slot-scope="{ row, index }" slot="action">
				<Button type="primary" size="small" style="margin-right: 5px" @click="show(row)">查看详细</Button>
				<Button type="error" size="small" @click="remove(index)">冻结用户</Button>
			</template>
		</Table>
		<Modal
				v-model="modal1"
				title='商户详细'
				@on-ok="ok"
				@on-cancel="cancel">
			<Tabs value="name1">
				<TabPane label="商品" name="name1">
					<Table height="200" :columns="columns2" :data="tab1"></Table>
				</TabPane>
				<TabPane label="发布的优惠" name="name2">
					<Table height="200" :columns="columns3" :data="tab2"></Table>
				</TabPane>
				<TabPane label="发布的团购" name="name3">
					<Table height="200" :columns="columns4" :data="tab3"></Table>
				</TabPane>
			</Tabs>
		</Modal>
	</div>
</template>

<script>
	export default {
		name: "AdminBackstage",
		data () {
			return {
				modal1:false,
				columns1: [
					{
						title: '店名',
						slot: 'name'
					},
					{
						title: '商铺类型',
						key: 'type'
					},
					{
						title: '地址',
						key: 'address'
					},
					{
						title: '操作',
						slot: 'action',
						align: 'center'
					}
				],
				columns2: [
					{
						title: '商品名',
						key: 'shop_name'
					},
					{
						title: '商品类型',
						key: 'type'
					},
					{
						title: '价格',
						key: 'price'
					},
				],
				columns3: [
					{
						title: '商品名',
						key: 'commodity_name'
					},
					{
						title: '折扣值',
						key: 'value'
					},
					{
						title: '备注信息',
						key: 'info'
					},
				],
				columns4: [
					{
						title: '商品名',
						key: 'commodity_name'
					},
					{
						title: '价格',
						key: 'groupprice'
					},
					{
						title: '备注信息',
						key: 'info'
					},
				],
				shop: [{}],
				tab1:[{}],
				tab2:[{}],
				tab3:[{}],
			}
		},
		methods: {
			async show (row) {
				this.modal1 =true
				let tab = await this.$axios.post('root/RootSee/shopxq',row).then(r=>r.data)
				this.tab1 = tab.commodity
				this.tab2 = tab.discount
				this.tab3 = tab.grouppurchase
				console.log(tab)
			},
			async remove (index) {

			},
			ok () {
				this.modal1= false
			},
			cancel () {
				this.modal1= false
			}
		},
		async mounted() {
			let kk=await this.$axios.post('root/RootSee/apply_state').then(r=>r.data)
			this.shop = kk.yitong
		}

	}
</script>

<style lang="less">
	.AdminBackstage{
		width: 1300px;
		margin: 50px auto;
		.ivu-table-row{
			font-size: 20px;
		}
		.ivu-select{
			margin-right: 5px;
		}
	}
</style>